import React from 'react'
import { connect } from 'react-redux'
import { ImportStyle } from 'sp-css-import'
import { pageinfo } from 'super-project'
import Sizing from '@ui/layout/sizing'

@connect()
@pageinfo((state/*, renderProps*/) => ({
    title: '核心数据',
    // metas: [
    //     { 'description': 'Super Project' },
    //     { 'super-locale-id': state.localeId },
    // ]
}))
@ImportStyle(require('./styles.less'))
export default class extends React.Component {
    render() {


        return (
            <Sizing>
                <div className={this.props.className}>

                    <div class="pure-g info">
                        <div class="pure-u-1-3"><Card val='187' desc='当前包月人数'></Card></div>
                        <div class="pure-u-1-3"><Card val='187' desc='当前包月人数'></Card></div>
                        <div class="pure-u-1-3"><Card val='187' desc='当前包月人数'></Card></div>
                    </div>




                    <table className='pure-table pure-table-horizontal info-1'>
                        <tr>
                            <td>新增粉丝数量：</td>
                            <td>100</td>
                        </tr>
                        <tr>
                            <td>公众号总粉丝数量：</td>
                            <td>100</td>
                        </tr>
                        <tr>
                            <td>商品页面流量人数：</td>
                            <td>100</td>
                        </tr>
                    </table>
                </div>
            </Sizing>
        )
    }
}



const Card = (porps) => {
    return (
        <div className="card">
            <div className="val">{porps.val}</div>
            <div className="desc">{porps.desc}</div>
        </div>
    )
}